import { computed, ref, type Ref } from "vue";

type Props<ListItem> = {
  loadData: (_params: { page: number; limit: number }) => Promise<{
    data: {
      list: any[];
      page: {
        total: number;
      };
    };
  }>;
};

/**
 * 列表数据
 */
const useListData = <ListItem>(props: Props<ListItem>) => {
  const { loadData } = props;
  // refresher triggered
  const refresherTriggered = ref(false);
  // data source
  const dataSource = ref([]) as Ref<any[]>;
  // pagination
  const pagination = ref({
    page: 0,
    limit: 10,
    total: 0,
    status: "loading",
  });
  // api data result
  const apiDataResult = ref(undefined) as Ref<any>;

  // refresh data
  const refreshData = async () => {
    try {
      const values = {
        page: pagination.value.page,
        limit: pagination.value.limit,
      };
      const result = await loadData(values);
      apiDataResult.value = result.data;
      if (values.page === 1) {
        // 初始化的情况下就覆盖
        dataSource.value = result.data.list;
      } else {
        result.data.list.forEach((item, index) => {
          if (item.date == dataSource.value[dataSource.value.length - 1].date) {
            dataSource.value[dataSource.value.length - 1].list = [
              ...dataSource.value[dataSource.value.length - 1].list,
              ...item.list,
            ];
          } else {
            dataSource.value.push(item);
          }
        });

        // 加载更多的情况下就追加
        // dataSource.value = [...dataSource.value, ...result.data.list];
      }
      pagination.value.total = result.data.page.total || 0;
      const allTotal = pagination.value.page * pagination.value.limit;
      // 当前条数小于总条数 则进入 loadMoreData 增加请求页数
      if (allTotal >= pagination.value.total) {
        pagination.value.status = "noMore";
      } else {
        pagination.value.status = "more";
      }
    } catch (error) {
      // 网路错误提示
      const message = "网络错误";
    } finally {
    }
  };

  // 初始化
  const initData = async () => {
    pagination.value.page = 1;
    pagination.value.total = 0;
    await refreshData();
  };

  // 加载更多数据
  const loadMoreData = async () => {
    if (
      pagination.value.status === "loading" ||
      pagination.value.status == "noMore"
    ) {
      return;
    }
    pagination.value.page++;
    pagination.value.status = "loading";
    // 调用加载数据方法
    await refreshData();
  };

  // 下拉刷新
  const pullDownRefresh = async () => {
    if (refresherTriggered.value == true) {
      return;
    }
    refresherTriggered.value = true;
    // 调用获取数据方法
    await initData();
    setTimeout(() => {
      // 结束下拉刷新
      refresherTriggered.value = false;
    }, 100);
  };

  // 更新 dataSource
  const updateDataSource = (newDataSource: typeof dataSource.value) => {
    dataSource.value = newDataSource;
  };

  const listData = computed(() => {
    return {
      dataSource: dataSource.value,
      refresherTriggered: refresherTriggered.value,
      pagination: pagination.value,
      apiDataResult: apiDataResult.value,
      initData,
      loadMoreData,
      pullDownRefresh,
      updateDataSource,
    };
  });

  return listData;
};

export default useListData;
